<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      var arr = [
        { id: '29', pid: '', name: '总裁办' },
        { id: '2c', pid: '', name: '财务部' },
        { id: '2d', pid: '2c', name: '财务核算部' },
        { id: '2f', pid: '2c', name: '薪资管理部' },
        { id: 'd2', pid: '', name: '技术部' },
        { id: 'd3', pid: 'd2', name: 'Java研发部' },
        { id: 'd31', pid: 'd3', name: 'Java研发部333' },
        { id: 'd33', pid: 'd3', name: 'Java研发部333' },
      ];
      // 前置知识： 当前元素A的pid 等于 另一个元素B的id的话， 那么 A就是B的子元素

      // 下面函数需要两个参数， 第一个是平铺的数组，第二个是最顶级的元素id
      function transformListToTree(list, rootId) {
        const arr = [];
        list.forEach((item) => {
          if (item.pid === rootId) {
            // 下面这句话，给所有的item加了一个 children属性
            // children属性 有没有值，取决于，对应的id 和 pid的关系
            item.children = transformListToTree(list, item.id);
            arr.push(item);
          }
        });

        return arr;
      }

      console.log(transformListToTree(arr, ''));

      // 递归 --- 函数内部自己调用自己
      // 斐波那契数列  1 1 2 3 5 8 13 21 。。。
      // 递归： 函数内部自己调用自己 +  函数内部一定要有退出条件
      // function loop(n) {
      //   console.log('执行几次，', n);
      //   if (n === 1 || n === 2) {
      //     return 1;
      //   }
      //   return loop(n - 1) + loop(n - 2);
      // }

      // loop(3);

      // loop(3) 解释
      // loop(2)                            + loop(1)
      // 进入if分支， 返回1，并退出loop函数   +  进入if分支， 返回1，并退出loop函数
      // 最后结果 1 + 1 = 2
      // 其他的loop(5) 最后都会归结到 n =1 或者2 去加起来计算

      // console.log(loop(5)); // 5
      // console.log(loop(7)); // 13
      // console.log(loop(20)); // 13
    </script>
  </body>
</html>
